<template>
  <div class="orderlist">
    <div class="backgroudimage" v-show="backgroundflag" @click="changeshow">
      <img class="ims" src="@/assets/img/background.png" alt />
    </div>
    <van-nav-bar title="直客业务销售辅助系统" @click-right="onClickRight" style="z-index:1001" fixed>
      <span></span>
      <!-- <van-icon
        :name="require('@/assets/img/computer.png')"
        slot="right"
        color="#333"
        size="0.6rem"
      /> -->
    </van-nav-bar>
    <van-tabs @change="onChange">
      <van-tab title="订单列表">
        <div class="ordersearch" style="z-index:1001">
          <div class="searchLeft">
            <form action="javascript:return true">
              <van-search
                v-model="value"
                show-action
                placeholder="订单号/客户名称/姓名/手机号/地址"
                @search="onSearch"
                @click="showSearch"
              >
                <div slot="action" @click="onSearch(value)">搜索</div>
              </van-search>
            </form>
          </div>
          <van-icon
            :name="require('@/assets/img/searchIcon.png')"
            slot="right"
            color="#333"
            size="0.44rem"
            class-prefix="menuIcon"
            @click="showSearchItem"
          />
        </div>
        <!--筛选项-->
        <van-popup v-model="IsshowSearchItem" position="top" :style="{}">
          <div class="menuItem">
            <label class>订单类型</label>
            <van-row justify="space-between" type="flex" :style="{margin:'0'}" align="center">
              <van-col
                span="8"
                @click="pick('orderType',index)"
                v-for="(item,index) in orderType"
                :key="index"
                :class="{active:item.active}"
              >{{item.text}}</van-col>
            </van-row>
          </div>
          <div class="menuItem">
            <label class>支付状态</label>
            <van-row justify="space-between" type="flex" :style="{margin:'0'}" align="center">
              <van-col
                span="8"
                @click="pick('payType',index)"
                v-for="(item,index) in payType"
                :key="index"
                v-show="index<=2"
                :class="{active:item.active}"
              >{{item.text}}</van-col>
            </van-row>
            <van-row
              justify="space-between"
              type="flex"
              :style="{marginLeft:'10px',marginTop:'10px'}"
              align="center"
            >
              <van-col
                span="8"
                @click="pick('payType',index)"
                :offset="item.offset"
                v-for="(item,index) in payType"
                :key="index"
                v-show="index>2"
                :class="{active:item.active}"
              >{{item.text}}</van-col>
            </van-row>
          </div>
          <div class="menuItem searchDate">
            <label class>下单时间</label>
            <div class="orderDate" @click="ShowCalendar('startDate')">{{startDate?startDate:'起始时间'}}</div>
            <span>-</span>
            <div class="orderDate" @click="ShowCalendar('endDate')">{{endDate?endDate:'截止时间'}}</div>
            <div class="clearDate" @click="clearDate">清空</div>
            <van-calendar
              v-show="isShowCalendar"
              :show-title="false"
              :show-subtitle="false"
              :poppable="false"
              :show-confirm="false"
              :row-height="30"
              :show-mark="false"
              color="#F18D00"
              :min-date="minDate"
              :max-date="maxDate"
              :default-date="defaultDate"
              @select="selectDate"
              :style="{width:'100%',height:'250px'}"
            />
          </div>
          <div class="btns">
            <div class="btn_cancel" @click="showSearchItem">取消</div>
            <div class="btn_confirm" @click="confirmSearch">确定</div>
          </div>
        </van-popup>

        <div class="list">
          <van-list v-model="loading" :finished="finished" finished-text="没有更多了" @load="onLoad">
            <van-pull-refresh v-model="isLoading" @refresh="onRefresh">
              <van-cell
                class="info"
                v-for="(good,index) in data.h5OrderListDTOS"
                :key="index"
                v-show="data.totalCount!=0"
              >
                <div @click="godetail(good.KaOrderId)" class="lsit">
                  <div class="label" @click.stop="selectitem(good)">
                    <span class="tit">订单号:</span>
                    <span class="con">{{good.UserNumber}}</span>
                  </div>
                  <ul class="logInfo" @click.stop="selectitem(good)">
                    <li>
                      <span class="add">{{good.ShrpProvinceName}}</span>
                      <span class="person">{{good.ShrpLinker}}</span>
                    </li>
                    <li class="arrow">
                      <img src="../../assets/img/log.png" alt />
                      <span class="arrowtext">{{good.KaStateStr}}</span>
                    </li>
                    <li>
                      <span class="add">{{good.CneeProvinceName}}</span>
                      <span class="person">{{good.CneeLinker}}</span>
                    </li>
                  </ul>
                  <div class="label">
                    <span class="tit">客户名称：</span>
                    <span class="con">{{good.UserName}}</span>
                  </div>
                  <div class="label">
                    <span class="tit">货量总计：</span>
                    <span class="con">{{good.Quantity}}件-{{good.Weight}}kg-{{good.Volume}}m³</span>
                  </div>
                  <div class="label">
                    <span class="tit">应收合计：</span>
                    <span class="con">￥{{good.TotalPrice}}</span>
                  </div>
                  <!-- <div class="label">
                    <span class="tit">承运状态：</span>
                    <span class="con">订单{{good.PushPlaformStr}}</span>
                  </div> -->
                  <div class="label">
                    <span class="tit">支付状态：</span>
                    <span v-show="good.PushPlaform==0">订单待确认</span>
                    <template v-if="good.PushPlaform!=0">
                      <template v-if="good.NoticeStatus=='待通知'">
                        <span>订单待确认</span>
                      </template>
                      <template v-if="good.NoticeStatus=='--'">
                        <span>未付款</span>
                      </template>
                      <template v-if="good.NoticeStatus=='已通知'">
                        <template v-if="good.ApPrice!=0">
                          <template v-if="Number(good.ApPrice)>=Number(good.TotalPrice)">
                            <span>已付款</span>
                          </template>
                          <template v-else-if="good.Payment!=0">
                            <span>未到账期</span>
                          </template>
                          <template v-else>
                            <span>部分支付</span>
                          </template>
                        </template>
                        <template v-if="good.ApPrice==0">
                          <template v-if="good.Payment==0">
                            <span>未付款</span>
                          </template>
                          <template v-if="good.Payment!=0">
                            <template v-if="good.BillsOrderStatus==1">
                              <span>未付款</span>
                            </template>
                            <template v-if="good.BillsOrderStatus==2">
                              <span>未到账期</span>
                            </template>
                          </template>
                        </template>
                      </template>
                    </template>
                  </div>
                  <div class="label lastlabel">
                    <span class="tit">物流信息：</span>
                    <span class="coninfo">{{good.OrderDes}}</span>
                  </div>
                </div>
                <div class="times">
                  <p>{{good.InputTime}}</p>
                </div>
                <div class="rightbtn" v-if="good.KaStateStr!='已取消'">
                  <!-- <div
                    class="btn-modify"
                    v-if="good.orderStatusBack<13"
                    @click="Suremodify(good.KaOrderId)"
                  >
                    <span>修改订单</span>
                  </div> -->
                  <!-- <div
                    class="btn-confirm"
                    v-if="good.displayLoadingButton== 1||good.displayLoadingButton==null"
                    @click="Surecarriage(good.KaOrderId)"
                  >
                    <span>确认承运</span>
                  </div> -->
                  <div
                    class="btn-confirm"
                    v-if="good.NoticeStatus=='待通知' && good.PushPlaformStr=='已承运'"
                    @click="pay(good)"
                  >
                    <span>确认订单</span>
                  </div>
                  <!-- <div
                    class="btn-error"
                    v-show="good.isModify==1"
                    @click="SureError(good.KaOrderId)"
                  >
                    <span>异常调整</span>
                  </div> -->
                </div>
              </van-cell>
            </van-pull-refresh>
          </van-list>
          <!-- <div class="Receivables">
            <button class="Receivables-btn" @click="add">新增订单</button>
          </div> -->
        </div>
      </van-tab>
      <van-tab title="上游收款">
        <div class="ordersearch" style="z-index:1001">
          <div class="searchLeft">
            <form action="javascript:return true">
              <van-search
                v-model="value"
                show-action
                placeholder="订单号/客户名称/姓名/手机号/地址"
                @search="onSearch"
                @click="showSearch"
              >
                <!-- <div slot="action"
                @click="onSearch(value)"
                v-show='isshowSearch'>搜索</div>-->
                <div slot="action" @click="onSearch(value)">搜索</div>
              </van-search>
            </form>
          </div>
          <van-icon
            :name="require('@/assets/img/searchIcon.png')"
            slot="right"
            color="#333"
            size="0.44rem"
            class-prefix="menuIcon"
            @click="showSearchItem"
          />
        </div>
        <!--筛选项-->
        <van-popup v-model="IsshowSearchItem" position="top" :style="{}">
          <div class="menuItem">
            <label class>订单类型</label>
            <van-row justify="space-between" type="flex" :style="{margin:'0'}" align="center">
              <van-col
                span="8"
                @click="pick('orderType',index)"
                v-for="(item,index) in orderType"
                :key="index"
                :class="{active:item.active}"
              >{{item.text}}</van-col>
            </van-row>
          </div>
          <div class="menuItem">
            <label class>支付状态</label>
            <van-row justify="space-between" type="flex" :style="{margin:'0'}" align="center">
              <van-col
                span="8"
                @click="pick('payType',index)"
                v-for="(item,index) in payType"
                :key="index"
                v-show="index<=2"
                :class="{active:item.active}"
              >{{item.text}}</van-col>
            </van-row>
            <van-row
              justify="space-between"
              type="flex"
              :style="{marginLeft:'10px',marginTop:'10px'}"
              align="center"
            >
              <van-col
                span="8"
                @click="pick('payType',index)"
                :offset="item.offset"
                v-for="(item,index) in payType"
                :key="index"
                v-show="index>2"
                :class="{active:item.active}"
              >{{item.text}}</van-col>
            </van-row>
          </div>
          <div class="menuItem searchDate">
            <label class>下单时间</label>
            <div class="orderDate" @click="ShowCalendar('startDate')">{{startDate?startDate:'起始时间'}}</div>
            <span>-</span>
            <div class="orderDate" @click="ShowCalendar('endDate')">{{endDate?endDate:'截止时间'}}</div>
            <div class="clearDate" @click="clearDate">清空</div>
            <van-calendar
              v-show="isShowCalendar"
              :show-title="false"
              :show-subtitle="false"
              :poppable="false"
              :show-confirm="false"
              :row-height="30"
              :show-mark="false"
              color="#F18D00"
              :min-date="minDate"
              :max-date="maxDate"
              :default-date="defaultDate"
              @select="selectDate"
              :style="{width:'100%',height:'250px'}"
            />
          </div>
          <div class="btns">
            <div class="btn_cancel" @click="showSearchItem">取消</div>
            <div class="btn_confirm" @click="confirmSearch">确定</div>
          </div>
        </van-popup>

        <div class="list">
          <van-list v-model="loading" :finished="finished" finished-text="没有更多了" @load="onLoad">
            <van-pull-refresh v-model="isLoading" @refresh="onRefresh">
              <van-cell
                class="info"
                v-for="(good,index) in data.h5OrderListDTOS"
                :key="index"
                v-show="data.totalCount!=0"
              >
                <div class="selectrece" @click.stop="selectitem(good)">
                  <van-checkbox v-model="good.selected"></van-checkbox>
                </div>
                <div @click="godetail(good.KaOrderId)" class="lsit">
                  <div class="label" @click.stop="selectitem(good)">
                    <span class="tit">订单号:</span>
                    <span class="con">{{good.UserNumber}}</span>
                  </div>
                  <ul class="logInfo" @click.stop="selectitem(good)">
                    <li>
                      <span class="add">{{good.ShrpProvinceName}}</span>
                      <span class="person">{{good.ShrpLinker}}</span>
                    </li>
                    <li class="arrow">
                      <img src="../../assets/img/log.png" alt />
                      <span class="arrowtext">{{good.KaStateStr}}</span>
                    </li>
                    <li>
                      <span class="add">{{good.CneeProvinceName}}</span>
                      <span class="person">{{good.CneeLinker}}</span>
                    </li>
                  </ul>
                  <div class="label">
                    <span class="tit">客户名称：</span>
                    <span class="con">{{good.UserName}}</span>
                  </div>
                  <div class="label">
                    <span class="tit">货量总计：</span>
                    <span class="con">{{good.Quantity}}件-{{good.Weight}}kg-{{good.Volume}}m³</span>
                  </div>
                  <div class="label">
                    <span class="tit">应收合计：</span>
                    <span class="con">￥{{good.TotalPrice}}</span>
                  </div>
                  <div class="label">
                    <span class="tit">承运状态：</span>
                    <span class="con">订单{{good.PushPlaformStr}}</span>
                  </div>
                  <div class="label">
                    <span class="tit">支付状态：</span>
                    <span v-show="good.PushPlaform==0">订单待确认</span>
                    <template v-if="good.PushPlaform!=0">
                      <template v-if="good.NoticeStatus=='待通知'">
                        <span>订单待确认</span>
                      </template>
                      <template v-if="good.NoticeStatus=='--'">
                        <span>未付款</span>
                      </template>
                      <template v-if="good.NoticeStatus=='已通知'">
                        <template v-if="good.ApPrice!=0">
                          <template v-if="Number(good.ApPrice)>=Number(good.TotalPrice)">
                            <span>已付款</span>
                          </template>
                          <template v-else-if="good.Payment!=0">
                            <span>未到账期</span>
                          </template>
                          <template v-else>
                            <span>部分支付</span>
                          </template>
                        </template>
                        <template v-if="good.ApPrice==0">
                          <template v-if="good.Payment==0">
                            <span>未付款</span>
                          </template>
                          <template v-if="good.Payment!=0">
                            <template v-if="good.BillsOrderStatus==1">
                              <span>未付款</span>
                            </template>
                            <template v-if="good.BillsOrderStatus==2">
                              <span>未到账期</span>
                            </template>
                          </template>
                        </template>
                      </template>
                    </template>
                  </div>
                  <div class="label lastlabel">
                    <span class="tit">物流信息：</span>
                    <span class="coninfo">{{good.OrderDes}}</span>
                  </div>
                </div>
                <div class="times">
                  <p>{{good.InputTime}}</p>
                </div>
                <div class="rightbtn" v-if="good.KaStateStr!='已取消'">
                  <!-- <div
                    class="btn-modify"
                    v-if="good.orderStatusBack<13"
                    @click="Suremodify(good.KaOrderId)"
                  >
                    <span>修改订单</span>
                  </div> -->
                  <!-- <div
                    class="btn-confirm"
                    v-if="good.displayLoadingButton== 1|| good.displayLoadingButton==null"
                    @click="Surecarriage(good.KaOrderId)"
                  >
                    <span>确认承运</span>
                  </div> -->
                  <div
                    class="btn-confirm"
                    v-if="good.NoticeStatus=='待通知' && good.PushPlaformStr=='已承运'"
                    @click="pay(good)"
                  >
                    <span>确认订单</span>
                  </div>
                  <!-- <div
                    class="btn-error"
                    v-show="good.isModify==1"
                    @click="SureError(good.KaOrderId)"
                  >
                    <span>异常调整</span>
                  </div> -->
                </div>
              </van-cell>
            </van-pull-refresh>
          </van-list>
          <div class="Receivables">
            <!-- <button class="Receivables-btn" @click="Receivablesshow">收款</button> -->
            <!-- <button class="Receivables-btn" @click="add">新增订单</button> -->
          </div>
          <div class="setpriceall">
            <div class="setpriceall_left">
              <van-checkbox v-model="checked" @click="changeselectall">
                <p
                  class="all"
                  style="font-size:16px;"
                >全选{{idlist.length>0? '/'+idlist.length+'单' : '/0单'}}</p>
              </van-checkbox>
              <span
                style="font-size:12px;color:#999999;margin-right:6px;float:left;display:block;margin:5px 6px 0 27px;"
              >共计:</span>
              <span
                style="font-size:12px;color:#FF6540;margin-right:35px;float:left;display:block;margin-top:6px;"
              >¥{{pricesum}}</span>
            </div>
            <div class="setpriceall_right">
              <!-- <van-button @click="Receivablesshow" class="noselect">取消</van-button> -->
              <van-button class="priceset" @click="shareprice">收款</van-button>
            </div>
          </div>
        </div>
      </van-tab>
    </van-tabs>

    <!-- <van-pagination v-model="currentPage"
                    :total-items="data.totalCount"
                    :show-page-size="3"
                    force-ellipses
                    @change='changpage'
                    class='page'
                    :page-count='pagecount'
    v-show='data.totalCount>5' />-->
  </div>
</template>
<script>
import Vue from "vue";
import { orderlist } from "@/api/orderlist";
import { pushOrderNotice } from "@/api/orderlist";
import { Pagination } from "vant";
Vue.use(Pagination);
import {
  Icon,
  Field,
  Button,
  Image,
  Search,
  Toast,
  List,
  Checkbox,
  SubmitBar,
  Popup,
  Col,
  Row,
  Calendar,
  PullRefresh,
  Tab,
  Tabs
} from "vant";
import { Dialog } from "vant";
import { createsharelist } from "@/api/sharelist";
import { share } from "@/api/orderlist";
import { formatDate } from "@/utils/utils";
Vue.use(Icon);
Vue.use(Field);
Vue.use(Button);
Vue.use(Image);
Vue.use(Search);
Vue.use(Toast);
Vue.use(List);
Vue.use(Checkbox);
Vue.use(SubmitBar);
Vue.use(Popup);
Vue.use(Col);
Vue.use(Row);
Vue.use(Calendar);
Vue.use(PullRefresh);
Vue.use(Tab);
Vue.use(Tabs);
export default {
  data() {
    return {
      value: "",
      loading: false,
      isLoading: false,
      finished: false,
      currentPage: 1,
      pagecount: 1,
      pageSize: 5,
      data: [],
      num: 0,
      serachTxt: "",
      isshowSearch: false,
      flag: false,
      checked: false,
      idlist: [],
      shownums: 0,
      pricesum: 0,
      backgroundflag: false,
      username: "",
      IsshowSearchItem: false,
      isActice: true,
      isShowCalendar: false,
      minDate: new Date(2000, 0, 1),
      maxDate: new Date(),
      defaultDate: new Date(),
      orderType: [
        {
          text: "全部",
          value: null,
          active: true
        },
        {
          text: "四通易达",
          value: 1,
          active: false
        },
        {
          text: "易达货运",
          value: 2,
          active: false
        }
      ],
      payType: [
        {
          text: "全部",
          value: null,
          active: true,
          offset: 0
        },
        {
          text: "待支付",
          value: 1,
          active: false,
          offset: 0
        },
        {
          text: "部分支付",
          value: 2,
          active: false,
          offset: 0
        },
        {
          text: "已支付",
          value: 3,
          active: false,
          offset: 8
        },
        {
          text: "未到账期",
          value: 4,
          active: false,
          offset: 0
        }
      ],
      startDate: null,
      endDate: null,
      chooseDateType: "startDate"
    };
  },
  created(){
  },
  mounted() {
    sessionStorage.clear();
    this.getorderlist();
  },
  methods: {
    onSearch(val) {
      this.serachTxt = val;
      this.isshowSearch = false;
      this.finished = false;
      this.num = 1;
      // if (this.serachTxt == '') {
      //   this.$toast('搜索关键词不能为空');
      // } else {
      this.getorderlist();
      // }
    },
    onChange(val) {
      if( val == 1) {
        this.num = 0;
        this.flag = true;
        this.getorderlist();
      } else if (val == 0){
        this.num = 0;
        this.flag = false;
        this.getorderlist();
      }
    },
    changeshow() {
      this.backgroundflag = false;
    },
    wechatShare(id) {
      // 判断苹果手机
      let url = window.location.href.split("#")[0];

      console.log(`Share init urls = ${url}`);

      let that = this;

      url = encodeURIComponent(url);

      //这里是封装的axios，换成任意请求皆可
      share(url).then(res => {
        wx.config({
          // 配置信息, 即使不正确也能使用 wx.ready
          debug: false,
          appId: res.data.appid,
          timestamp: res.data.timestamp,
          nonceStr: res.data.noncestr,
          signature: res.data.sign,
          jsApiList: ["updateAppMessageShareData", "updateTimelineShareData"]
        });
        wx.ready(function() {
          //需在用户可能点击分享按钮前就先调用
          console.log("初始化成功");
          let wxData = {
            title: "四通易达", // 分享标题
            desc: `您的好友${that.username}向您发起一笔收款，请及时支付`, // 分享描述
            link: Vue.prototype.$conf.domainname + `/?#/receivables?id=${id}`,
            imgUrl:
              "https://lecarlinkoss.oss-cn-beijing.aliyuncs.com/media/wx/zt/hz/4c53c879309e46ba89dd3cd7fa0d7e43.png", // 分享图标
            success: function() {
              console.log("设置成功");
              this.backgroundflag = true;
            },
            fail: function(err) {
              console.log("设置失败" + JSON.stringify(err));
              alert(`分享设置失败: ${JSON.stringify(err)}`);
              this.backgroundflag = true;
            }
          };

          wx.updateAppMessageShareData(wxData);
          wx.updateTimelineShareData(wxData);
        });
        wx.error(function(err) {
          console.log(err);
          alert(`微信配置初始化失败: ${JSON.stringify(err)}`);
        });
      });
      this.backgroundflag = true;
    },

    shareprice() {
      let iswx = (function() {
        return (
          navigator.userAgent.toLowerCase().indexOf("micromessenger") !== -1
        );
      })();

      if (iswx) {
        let ids = this.idlist.map(item => {
          return item.KaOrderId;
        });

        createsharelist(ids).then(res => {
          if (res.code == 200) {
            this.username = res.data.shareName;
            this.wechatShare(res.data.shareBillId);
          }
        });
      } else {
        alert("请在转由微信进行操作");
      }
    },
    onSubmit() {},
    // Receivablesshow() {
    //   this.flag = !this.flag;
    //   this.getorderlist();
    // },
    setpricesum() {
      if (this.idlist && this.idlist.length > 0) {
        this.pricesum = this.idlist
          .reduce(function(prev, cur) {
            return Number(cur.TotalPrice) + prev;
          }, 0)
          .toFixed(2);
      } else {
        this.pricesum = 0;
      }
    },
    selectitem(good) {

      if (good.selected == false) {
        good.selected = true;
        this.idlist.push(good);
        let is = this.data.h5OrderListDTOS.some(item => {
          return item.selected == false;
        });

        if (is == false) {
          this.checked = true;
        }
        this.setpricesum();
      } else {
        good.selected = false;
        let position = this.idlist.findIndex(item => {
          return item.KaOrderId == good.KaOrderId;
        });

        this.idlist.splice(position, 1);
        this.checked = false;
        this.setpricesum();
      }
    },
    onCancel() {
      // Toast('取消');
    },
    getorderlist() {
      let parm = {
        currentPage: this.currentPage,
        pageSize: this.pageSize,
        serachTxt: this.serachTxt,
        orderTypes: this.orderTypes,
        payTypes: this.payTypes,
        h5StartDate: this.startDate,
        h5EndDate: this.endDate
      };

      if (this.flag) {
        parm.payMode = true;
      }

      orderlist(parm).then(res => {
        let ids = [];

        if (this.flag && res.data.h5OrderListDTOS.length <= 0) {
          this.$toast(
            "当前搜索状态下，无符合收款条件订单，请确认订单未收款，或已完成对账！"
          );
        } else {
          res.data.h5OrderListDTOS.forEach(item => {
            if (this.idlist && this.idlist.length > 0) {
              ids = this.idlist.map(obj => {
                return obj.KaOrderId;
              });

              item.selected = ids.indexOf(item.KaOrderId) > -1;
            } else {
              item.selected = false;
            }
          });
          res.data.h5OrderListDTOS = Array.from(res.data.h5OrderListDTOS);
          this.data = res.data;
          let is = this.data.h5OrderListDTOS.some(item => {
            return item.selected == false;
          });

          if(this.data.h5OrderListDTOS.length == 0){
            this.checked = false;
          }else{
            this.checked = !is;
          }
          this.pagecount = Math.ceil(res.data.totalCount / this.pageSize);
        }
      });
    },
    onLoad() {
      setTimeout(() => {
        this.num++;
        let parm = {
          currentPage: this.num,
          pageSize: this.pageSize,
          serachTxt: this.serachTxt,
          orderTypes: this.orderTypes,
          payTypes: this.payTypes,
          h5StartDate: this.startDate,
          h5EndDate: this.endDate
        };

        if (this.flag) {
          parm.payMode = true;
        }
        if (this.num != 1) {
          orderlist(parm).then(res => {
            if (this.flag && res.data.h5OrderListDTOS.length <= 0) {
              this.$toast(
                "当前搜索状态下，无符合收款条件订单，请确认订单未收款，或已完成对账！"
              );
            } else if (res.data.h5OrderListDTOS.length == 0) {
              this.loading = false;
              this.finished = true;
            } else {
              res.data.h5OrderListDTOS.forEach(item => {
                item.selected = false;
                this.data.h5OrderListDTOS.push(item);
              });
              this.checked = false;
              this.loading = false;
            }
          });
        } else {
          this.loading = false;
        }
      }, 1000);
    },
    onRefresh() {
      setTimeout(() => {
        this.num = 0;
        this.finished = false;
        this.loading = false;
        this.getorderlist();
        this.isLoading = false;
      }, 1000);
    },
    // changpage (val) {
    //   this.currentPage = val;
    //   this.getorderlist();
    // },
    godetail(val) {
      this.$router.push({
        path: "/orderdetail",
        query: { orderId: val, isEdit: 0 }
      });
    },
    add() {
      this.$router.push({
        path: "/shureList"
      });
    },
    changeselectall() {
      if (!this.checked) {
        this.checked = false;
        this.data.h5OrderListDTOS.forEach(item => {
          item.selected = false;
        });
        let arrayone = this.idlist;

        let arraytwo = this.data.h5OrderListDTOS;

        let arr3 = [];

        for (let index = 0; index < arrayone.length; index++) {
          let item = arrayone[index];

          if (!arraytwo.some(v => v.KaOrderId === item.KaOrderId)) {
            arr3.push(item);
          }
        }
        this.idlist = arr3;
        this.setpricesum();
      } else {
        this.checked = true;
        this.data.h5OrderListDTOS.forEach(item => {
          item.selected = true;
        });
         this.idlist = [];
        this.idlist.push.apply(this.idlist, this.data.h5OrderListDTOS);
        this.setpricesum();
      }
    },
    showSearch() {
      this.isshowSearch = true;
    },
    onClickRight() {
      // let url = window.location.host;

      // let index = url.indexOf("pre");

      // if (index <= -1) {
      //   window.location.href = "https://ka.lecarlink.com/index.aspx";
      // } else {
      //   window.location.href = "https://ka-pre.lecarlink.com/index.aspx";
      // }
    },
    Surecarriage(val) {
      this.$router.push({
        path: "/details",
        query: { orderId: val }
      });
    },
    SureError(val) {
      this.$router.push({
        path: "/adjust",
        query: { orderId: val }
      });
    },
    Suremodify(val) {
      this.$router.push({
        path: "/orderdetail",
        query: { orderId: val, isEdit: 1 }
      });
    },
    pay(val) {
      Dialog.confirm({
        message: "请确认该笔订单当前货量和价格准确，是否通知给客户？"
      })
        .then(() => {
          let parm = {
            kaOrderId: val.KaOrderId
          };

          pushOrderNotice(parm).then(res => {
            if (res.code == 200) {
              this.getorderlist();
            }
          });
        })
        .catch(() => {
          // on cancel
        });
    },
    //显示隐藏 筛选项
    showSearchItem() {
      this.IsshowSearchItem = !this.IsshowSearchItem;
    },
    //显示隐藏日历
    ShowCalendar(type) {
      this.defaultDate = new Date();
      this.isShowCalendar = !this.isShowCalendar;
      if(!this.isShowCalendar){
        return;
      }
      this.chooseDateType = type;
      if (type == "endDate") {
        console.log(this.startDate)
        this.minDate = new Date(this.startDate ? this.startDate : "2000-01-01");
      } else {
        console.log(new Date("2000-01-01"))
        this.minDate = new Date("2000-01-01");
        // this.maxDate = new Date();
      }
    },

    //选择筛选项
    pick(type, index) {
      let arr = this[type];

      arr[index].active = !arr[index].active;
      let isAll = index == 0;

      if (index == 0) {
        arr.forEach(item => {
          item.active = false;
        });
        arr[0].active = isAll;
      } else {
        let filterArr = arr.filter(item => {
          return item.active;
        });

        arr[0].active = filterArr.length == 0;
      }
    },
    //点击日期 选择起始  截止日期
    selectDate(date) {
      this[this.chooseDateType] = formatDate(date, "yyyy-MM-dd");
      this.isShowCalendar = false;
      // console.log(formatDate(date,"yyyy-MM-dd"));
    },
    //筛选 提交
    confirmSearch() {
      let orderTypes = [];

      let payTypes = [];

      this.orderType.forEach((item, i) => {
        if (item.active && i != 0) {
          orderTypes.push(item.value);
        }
      });

      this.payType.forEach((item, i) => {
        if (item.active && i != 0) {
          payTypes.push(item.value);
        }
      });

      this.orderTypes = orderTypes;
      this.payTypes = payTypes;
      this.currentPage = 1;

      this.getorderlist();
      this.IsshowSearchItem = false;
    },
    clearDate() {
      this.endDate = null;
      this.startDate = null;
    },
    onClickLeft: function() {
      this.$toast("提货列表");
      this.$router.push({
        path: "/pickUpList",
        query: {}
      });
    }
  }
};
</script>
<style>
  .van-calendar__selected-day {
    width: 39px!important;
    height: 39px!important;
    border-radius: 50%;
  }
  .van-popup--top{
    overflow: hidden;
  }
</style>
<style lang="scss" scoped>
.orderlist {
  width: 100%;
  padding-bottom: 60px;
}
.ordertlistlist {
  width: 100%;
  height: 43px;
  display: flex;
  border-bottom: 1px solid #efefef;
  align-items: center;
  justify-content: space-between;
  padding: 0 19px;
  box-sizing: border-box;
  background: #fff;
  p {
    font-family: PingFangSC-Medium;
    font-size: 18px;
    color: #333333;
  }
  img {
    width: 21px;
    height: 19px;
  }
}

.ordersearch {
  background: #fff;
  // padding-top: 46px;
  position: fixed;
  top: 87px;
  left: 0;
  width: 100%;
  z-index: 2;
}

.list {
  // padding: 10px 16px 0 16px;
  padding: 140px 16px 0 16px;
  background: #f8f8f8;
  text-align: center;
}

.nolist {
  width: 100%;
  height: 100%;
}

.info {
  background: #fff;
  padding: 0 14px 17px 14px;
  margin-bottom: 10px;
  position: relative;
  .label {
    font-family: PingFangSC-Regular;
    font-size: 14px;
    text-align: left;
    padding-top: 14px;
    display: flex;
    margin-left: 29px;
    .tit {
      color: #999999;
      width: 73px;
    }
    .con {
      color: #333333;
      flex: 1;
    }
    .coninfo {
      color: #00b578;
      flex: 1;
    }
  }
  .logInfo {
    display: flex;
    justify-content: space-between;
    li{
      text-align: center;
    }
    span {
      display: block;
    }
    img {
      width: 46px;
      height: 11px;
    }
    .arrow {
      width: 54px;
    }
    .add {
      width: 128px;
      overflow: hidden;
      text-overflow: ellipsis;
      white-space: nowrap;
      font-family: PingFangSC-Medium;
      font-size: 16px;
      color: #333333;
      letter-spacing: 0;
      padding-top: 4px;
    }
    .person {
      font-family: PingFangSC-Regular;
      font-size: 13px;
      color: #666666;
      padding-top: 5px;
    }
    .arrowtext {
      font-family: PingFangSC-Medium;
      font-size: 13px;
      color: #f18d00;
      margin-top: -5px;
    }
  }
  .lastlabel {
    border-bottom: 1px solid #efefef;
    padding-bottom: 7px;
  }
  .times {
    font-family: PingFangSC-Regular;
    font-size: 14px;
    color: #666666;
    text-align: left;
    padding-top: 7px;
  }
  .rightbtn {
    display: flex;
    justify-content: flex-end;
    padding-top: 7px;
    text-align: center;
    div {
      display: flex;
      align-items: center;
      justify-content: center;
    }
    .btn-modify {
      width: 85px;
      height: 32px;
      line-height: 32px;
      background: #fdf3e4;
      border: 1px solid #f18d00;
      border-radius: 3px;
      margin-left: 15px;
      span {
        font-family: PingFangSC-Regular;
        font-size: 14px;
        color: #f18d00;
      }
    }
    .btn-confirm {
      width: 85px;
      height: 32px;
      background: #f18d00;
      border: 1px solid #f18d00;
      border-radius: 3px;
      margin-left: 15px;
      span {
        font-family: PingFangSC-Regular;
        font-size: 14px;
        color: #fff;
      }
    }
    .btn-error {
      width: 85px;
      height: 32px;
      background: #ff6540;
      border: 1px solid #ff6540;
      border-radius: 3px;
      margin-left: 15px;
      span {
        font-family: PingFangSC-Regular;
        font-size: 14px;
        color: #fff;
      }
    }
  }
}

.page .van-pagination__item--active {
  background: #fdf3e4;
}

.page .van-pagination__item {
  color: #f18d00;
}

.page .van-pagination__item:active {
  color: #fff;
  background-color: #fdf3e4;
}

.page .van-pagination__item--disabled,
.van-pagination__item--disabled:active {
  color: #646566;
  background-color: #999;
  cursor: not-allowed;
  opacity: 0.5;
}

.van-dialog__confirm,
.van-dialog__confirm:active {
  color: #f18d00;
}
.Receivables {
  width: 100%;
  height: 60px;
  display: flex;
  justify-content: center;
  align-items: center;
  position: fixed;
  bottom: 0px;
  left: 0;
  background: #fff;
  z-index: 3;
  .Receivables-btn {
    width: 343px;
    height: 44px;
    border-radius: 4px;
    background: #ff6540;
    text-align: center;
    line-height: 44px;
    border: none;
    outline: none;
    color: #ffffff;
    font-size: 18px;
  }
}
.selectrece {
  z-index: 2;
  position: absolute;
  left: 0px;
  top: 15px;
  margin-right: 15px;
}
.lsit {
  z-index: 0;
  position: relative;
}
.setpriceall {
  height: 375px;
  height: 60px;
  display: flex;
  justify-content: space-between;
  position: fixed;
  bottom: 0;
  left: 0;
  z-index: 3;
  background: #fff;
  width: 100%;
  .setpriceall_left {
    width: 212px;
    padding: 4px 11px 9px 11px;
    box-sizing: border-box;
  }
  div {
    // flex: 1;
  }
  .all {
    margin-right: 62px;
  }
  .noselect {
    width: 80px;
    height: 60px;
    font-size: 18px;
    color: #ffffff;
    background: #f18d00 100%;
    position: relative;
    left: 0;
    outline: none;
    border: none;
    float: left;
  }
  .priceset {
    width: 80px;
    height: 60px;
    font-size: 18px;
    color: #ffffff;
    background: #ff6540 100%;
    float: right;
    position: relative;
    left: 0;
    border: none;
    outline: none;
    float: left;
  }
}
.backgroudimage {
  width: 100%;
  height: 100%;
  position: fixed;
  top: 0;
  left: 0;
  background: rgba(0, 0, 0, 0.5);
  display: flex;
  justify-content: center;
  align-items: center;
  z-index: 3000;
  .ims {
    width: 100%;
    height: 100%;
  }
}
.searchLeft {
  width: 323px;
  float: left;
}
.menuIcon {
  float: left;
  margin-top: 17px;
  padding-left: 10px;
  padding-top: 2px;
  border-left: 1px solid #979797;
}
.menuItem {
  padding: 0 20px;
  text-align: center;
  box-sizing: border-box;
  text-align: left;
  margin-top: 15px;
}
.menuItem .van-row {
  text-align: center;
}
.menuItem > label {
  font-size: 15px;
  color: #333333;
  font-weight: bold;
  margin-bottom: 10px;
  display: block;
}
.menuItem .van-col {
  font-size: 12px;
  color: #666;
  background: #f3f3f3;
  border-radius: 2px;
  border-radius: 2px;
  width: 100px;
  height: 30px;
  line-height: 30px;
}
.active {
  color: #f18d00 !important;
  background: #fff8f4 !important;
  border: 1px solid #f18d00;
}
.orderDate {
  background: #ffffff;
  border: 1px solid #999999;
  border-radius: 2px;
  border-radius: 2px;
  width: 100px;
  height: 30px;
  line-height: 30px;
  text-align: center;
  color: #999;
  display: inline-block;
  font-size: 12px;
  box-sizing: border-box;
  margin-bottom: 15px;
}
.searchDate {
  margin-bottom: 15px;
}
.searchDate span {
  display: inline-block;
  color: #999;
  margin: 0 4.5px;
  height: 30px;
  line-height: 30px;
}
.van-calendar__header-subtitle {
  height: 24px;
  line-height: 24px;
}
.btns {
  background: #fff;
  width: 100%;
  box-shadow: 0 -1px 12px 0 rgba(0, 0, 0, 0.12);
  padding: 15px;
}
.btns div {
  width: 164px;
  box-sizing: border-box;
  text-align: center;
  height: 44px;
  line-height: 44px;
  font-size: 18px;
  letter-spacing: 0.58px;
  display: inline-block;
}
.btn_cancel {
  color: #f18d00;
  border: 1px solid #f18d00;
  border-radius: 2px;
}
.btn_confirm {
  background: #f18d00;
  border-radius: 2px;
  color: #fff;
  margin-left: 16px;
}
.clearDate {
  display: inline-block;
  color: #f18d00;
  font-size: 12px;
  line-height: 30px;
  margin-left: 18px;
  width: 50px;
  text-align: center;
}
.van-nav-bar__text {
  color: #ff6540;
}
/deep/.van-tabs__wrap,
/deep/.van-hairline--top-bottom {
  position: fixed;
  z-index: 1000;
  top: 43px;
  width: 100%;
}
</style>


